<!DOCTYPE html>
<html lang="en">
<head>
  <!-- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap-grid.css" rel="stylesheet"> -->
  <link href="../vendor/bootstrap-grid.css" rel="stylesheet">

  <meta charset="utf-8"/>
  <link rel="apple-touch-icon" sizes="76x76" href="../assets/img/favicon.ico">
  <link rel="icon" type="image/png" href="../assets/img/favicon.ico">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport'/>



  <!-- Font Awesome Icons -->

  <!-- Main CSS -->
  <link href="../assets/css/main.css" rel="stylesheet"/>

  <!-- Animation CSS -->
  <link href="../vendor/aos.css" rel="stylesheet"/>
  <link href="../assets/layui/css/layui.css" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="../assets/font/iconfont.css" />
  <style>

    .card-footer button {
      margin-left: 40px;
    }

    p {
      font-size: 16px;
    }

    .main {
      margin-top: 10px;
    }
    /* 更改Select组件下拉框的宽度 */
    .main .layui-select-title input {
      width: 80px; /* 自定义宽度，略小于Select组件的宽度以容纳下拉箭头 */
    }
    #sharedType .layui-select-title input {
      width: 150px; /* 自定义宽度，略小于Select组件的宽度以容纳下拉箭头 */
    }

    /* 更改Select组件的高度 */
    .main  .layui-form-select {
      height: 40px; /* 自定义高度 */
    }
    /* 更改Select组件的高度 */
    #sharedType  .layui-form-select {
      height: 40px; /* 自定义高度 */
    }

    /* 更改Select组件下拉框的最大高度 */
    .main .layui-anim-upbit {
      max-height: 220px; /* 自定义下拉框的最大高度 */
    }
    .main .inline-input{
      width: 120px;
    }

    /* 更改Select组件下拉框的最大高度 */
    #sharedType .layui-anim-upbit {
      max-height: 220px; /* 自定义下拉框的最大高度 */
    }
    #sharedType .inline-input{
      width: 150px;
    }


  </style>
</head>

<body>


<div class="main col-md-12" >
    <form id="ordersDetail" class="layui-form layui-form-pane" lay-filter="ordersDetailForm" >
      <div class="row form-group">
        <div class="col">
          <label class="layui-form-label">产品名称：</label>
          <div class="layui-input-block" style="margin-left: 120px;">
            <input type="text" class="form-control"  name="productName" disabled >
          </div>
        </div>
        <div class="col ">
          <label class="layui-form-label">卖家:</label>
          <div class="layui-input-block" style="margin-left: 120px;">
            <input name="createBy" class="form-control" id="createBy" disabled
            >
          </div>
        </div>
      </div>
      <div class="row form-group">
        <div class="col">
            <label class="layui-form-label"><span style="color: red;">*</span>订单ID：</label>
            <div class="layui-input-block" style="margin-left: 120px;">
                <input id="datasourceDbName" name="orderId" disabled class="form-control"/>
            </div>
        </div>
        <div class="col form-group">
          <label class="layui-form-label" >数据访问：</label>
          <div class="layui-input-block" style="margin-left: 120px;">
              <input id="sharedTypeText" name="sharedTypeText" disabled class="form-control"/>
<!--            <select name="sharedType" lay-verify="" style="width: 180px" disabled>-->
<!--              <option value="0">自由共享</option>-->
<!--              <option value="1">授权</option>-->
<!--              <option value="2">确权</option>-->
<!--              <option value="3">确权授权</option>-->
<!--            </select>-->
          </div>
        </div>
      </div>
      <div class="row form-group">
        <div class="col form-group">
          <label class="layui-form-label">访问信息</label>
          <div class="layui-input-inline">
            <input type="text" class="inline-input layui-input" placeholder="暂无"  name="buyNum" disabled>
          </div>
          <div class="layui-input-inline">
<!--            <select name="buyType" lay-verify="" disabled>-->
<!--              <option value="0">次数</option>-->
<!--              <option value="4">天数</option>-->
<!--              <option value="2">记录数</option>-->
<!--            </select>-->
            <input id="buyTypeText" name="buyTypeText" disabled class="inline-input layui-input" type="text" style="width: 80px;"/>
          </div>
        </div>
        <div class="col form-group">
          <label class="layui-form-label">使用信息</label>
          <div class="layui-input-inline">
            <input type="text" class="inline-input layui-input" placeholder="暂无" name="useNum" disabled>
          </div>
          <div class="layui-input-inline">
<!--            <select name="useType" lay-verify="" disabled>-->
<!--              <option value="0">次数</option>-->
<!--              <option value="4">天数</option>-->
<!--            </select>-->
              <input id="useTypeText" name="useType" disabled class="inline-input layui-input" type="text" style="width: 80px;"/>
<!--              <input type="text" class="inline-input layui-input" placeholder="暂无" name="useNum" disabled>-->
<!--            <input id="useTypeText" name=useNum" disabled  class="inline-input layui-input" type="text" style="width: 80px;"/>-->
          </div>
        </div>
      </div>
      <div class="row form-group">
        <div class="col">
          <label  class="layui-form-label"><span style="color: red;">*</span>是否加密：</label>
          <div class="layui-input-block" style="margin-left: 120px;">
<!--            <select class="form-control" name="isAudit" disabled>-->
<!--              <option value="-1">不加密</option>-->
<!--              <option value="1">加密</option>-->
<!--            </select>-->
            <input id="isAuditText" name="isAuditText" disabled class="form-control"/>
          </div>
        </div>
        <div class="col">
          <label  class="layui-form-label"><span style="color: red;">*</span>订单价格：</label>
          <div class="layui-input-block" style="margin-left: 120px;">
            <input type="text" class="form-control" name="customerProductPrice" id="customerProductPrice" disabled>
          </div>
        </div>
      </div>
    </form>

  </div>


  <!--------------------------------------
  JAVASCRIPT
  --------------------------------------->
  <script src="../vendor/jquery.min.js" type="text/javascript"></script>
  <script src="../assets/layui/layui.js" type="text/javascript"></script>
  <script src="../js/tool.js" type="text/javascript"></script>



  <script>
    $(function () {
      $('#ordersDetail input[type=text]').css("background-color", '#e9ecef');
      // $('#ordersDetail select').css("background-color", '#e9ecef');
      // 获取URL中的查询参数部分
      const queryString = window.location.search;
      // 解析查询参数字符串，将其转换为对象
      const urlParams = new URLSearchParams(queryString);
      // 获取associateId参数的值 订单的id
      const id = Number(urlParams.get('id'));
      const  form=layui.form;
      const sharedType=[
          '自由共享',
          '授权',
          '确权',
          '确权授权'
      ]
        const buyType={
          0:'次数',
            4:'天数',
            2:'记录数'
        }
        const useType={
            0:'次数',
            4:'天数',
        }
        const isAudit={
            "-1":'不加密',
            "1":'加密',
        }
      if (id){
        $.ajax({
          url: window.Http + `/orderProduct/${id}`,
          type: 'GET',
          headers: {
            'Authorization': "Bearer " + sessionStorage.getItem('Token')
          },
          success: function (res) {
            if (res.code === 200) {
              const ordersDetailForm = res.data;
              // 访问信息和使用信息处理
              ordersDetailForm.useType = useType[ordersDetailForm.customerBillingTypeLocal];
              ordersDetailForm.buyTypeText = buyType[ordersDetailForm.customerBillingType];
                console.log(' ordersDetailForm.useType',  ordersDetailForm.useType)
              ordersDetailForm.isAuditText=isAudit[String(ordersDetailForm.isLocked)]
                ordersDetailForm.sharedTypeText=sharedType[ordersDetailForm.sharedType]
              ordersDetailForm.buyNum =
                      ordersDetailForm.customerCanUseDay || ordersDetailForm.customerCanUseNumber || ordersDetailForm.customerCanUseRecords
              ordersDetailForm.useNum =
                      ordersDetailForm.customerCanUseDayLocal || ordersDetailForm.customerCanUseNumberLocal
              // 表单赋值
              form.val('ordersDetailForm', ordersDetailForm);
            } else {
              layer.msg(res.msg)
            }
          }
        })
      }else {
        layer.msg('获取订单信息失败')
      }
    })
  </script>

</body>
</html>
